window.onload = function () {
    let id = localStorage.getItem('uid')
    let params = { id }
    let ul = document.querySelector('#shopping-cart>ul')
    let k = document.querySelector('.watermark')
    axios.get(carlistAPI, { params })
        .then(res => {
            let arr = res.data.data
            let lis = arr.map(arr =>
                `
                <li>
                <input type="checkbox" class='check'>
                <img src="${arr['pimg']}" alt="">
                <p>${arr['pname']}</p>
                <p class='money'>${arr['pprice']}</p>
                <div class="add">
                    <span class='minus'>-</span>
                    <span class='pNam'>${arr['pnum']}</span>
                    <span class='addN'>+</span>
                </div>
                <p class='sum'>${(arr['pnum'] * arr['pprice']).toFixed(2)}元</p>
                    <button class="del" data-pid=${arr['pid']}>删除</button>
                </li >
                `
            )
            // k.style.display = 'black';
            ul.innerHTML += lis.join('')
            // if(ul.innerHTML += lis.join('')){
            //     k.style.display = 'none'; 
            // }else{
            //     k.style.display = 'black';
            // }
            //全选
            select()
            deletecar()
            updataNum()
            updataNUM()
        })
    //删除
    function deletecar() {
        let dels = document.querySelectorAll('.del')
        let uid = id
        for (let i = 0; i < dels.length; i++) {
            dels[i].addEventListener('click', () => {
                ZJ()
                dels[i].parentNode.remove()
                let pid = dels[i].getAttribute('data-pid')
                params = { uid, pid }
                axios.get(deleteCarAPI, { params })
                    .then(res => {
                        alert(res.data.msg)
                        allipt.forEach(checks => {
                            checks.onclick = () => {
                                let arr = [...allipt]
                                let flag = arr.every(input => input.checked === true)
                                topipt.checked = flag
                                downipt.checked = flag
                                ZJ()
                            }
                        })
                    })
            })
        }

    }
    // 算账
    function sum(num, price) {
        let sum = (parseInt(num) * parseInt(price)).toFixed(2)
        return sum
    }
    //加法修改
    function updataNum() {
        let adds = document.querySelectorAll('.addN')
        let dels = document.querySelectorAll('.del')
        let sums = document.querySelectorAll('.sum')
        let money = document.querySelectorAll('.money')
        for (let i = 0; i < adds.length; i++) {
            adds[i].addEventListener('click', () => {

                let num = parseInt((adds[i].previousElementSibling).innerHTML);
                (adds[i].previousElementSibling).innerHTML = ++num
                let pid = dels[i].getAttribute('data-pid')
                let price = money[i].innerHTML
                ZJ()
                updateCar(pid, num)
                sums[i].innerHTML = sum(num, price)
                let checks = document.querySelectorAll('.check')
                let flag1 = 0
                for (let j = 0; j < checks.length; j++) {
                    if (checks[j].checked == true) {
                        flag1++
                    }
                }
            })
        }
    }
    //减法修改
    function updataNUM() {
        let minus = document.querySelectorAll('.minus')
        let adds = document.querySelectorAll('.addN')
        let dels = document.querySelectorAll('.del')
        let sums = document.querySelectorAll('.sum')
        let money = document.querySelectorAll('.money')
        for (let i = 0; i < minus.length; i++) {
            minus[i].addEventListener('click', () => {
                let num = parseInt((adds[i].previousElementSibling).innerHTML);
                if (num >= 2) {
                    (adds[i].previousElementSibling).innerHTML = --num
                    let pid = dels[i].getAttribute('data-pid')
                    let price = money[i].innerHTML
                    updateCar(pid, num)
                    sums[i].innerHTML = sum(num, price)
                    ZJ()
                } else {
                    num = 1;
                    alert("本商品1件起售");
                }
            })

        }
    }
    // 更新
    function updateCar(pid, num) {
        let uid = id
        let pnum = num
        let params = { uid, pid, pnum }
        axios.get(updateCarAPI, { params })
            .then(res => {
                console.log(res);
            })
    }
    // 选择
    function select() {
        let topipt = document.querySelector('#allipt')
        let downipt = document.querySelector('#bomallipt')
        let allipt = document.querySelectorAll('.check')
        topipt.addEventListener('click', () => {
            allipt.forEach(arr => {
                arr.checked = topipt.checked
                downipt.checked = topipt.checked
            })
            ZJ()
        })
        
        downipt.addEventListener('click', () => {

            allipt.forEach(arr => {
                arr.checked = downipt.checked
                topipt.checked = downipt.checked
            })
            ZJ()
        })

        //单选         

       
    }
    //总计 
    function ZJ() {
        let carmoney = document.querySelector('#carmoney')
        let carnum = document.querySelector('#carnum')
        let allipt = document.querySelectorAll('.check')
        let arr = [...allipt]

        //所有被选中的框
        let filterArr = arr.filter(v => v.checked == true)

        //遍历 获取
        let pNum = 0
        let money = 0
        if (filterArr.length == 0) {
            carmoney.innerHTML = '0'
            carnum.innerHTML = '0'
        }
        filterArr.forEach(v => {
            pNum += parseInt(v.parentNode.querySelector('.pNam').innerHTML)
            money += (parseInt(v.parentNode.querySelector('.pNam').innerHTML) *
                parseInt(v.parentNode.querySelector('.money').innerText));
            carmoney.innerHTML = money
            carnum.innerHTML = pNum
            console.log(money, pNum);
        })

    }
}